<html>
<head>
</head>
<body>
  <h1>Vue响应式原理-分析</h1>

  <div id="app">
    <h2>差值表达式</h2>
    <h3>{{ msg }}</h3>
    <h3>{{ count }}</h3>

    <h2>v-text</h2>
    <div v-text="msg"></div>

    <h2>v-model</h2>
    <input type="text" v-model="msg">
    <input type="text" v-model="count">
  </div>

  <script src="./dep.js"></script>
  <script src="./watcher.js"></script>
  <script src="./compiler.js"></script>
  <script src='./observer.js'></script>
  <script src='./vue.js'></script>
  <script>
    let vm = new Vue({
      el: '#app',
      data: {
        msg: 'Hello vue',
        count: 22,
        person: {name: 'zhangsan'}
      }
    })
    console.log(vm)
    // vm.person = { abc: 'abc' }
    // console.log(vm)
  </script>
</body>
</html>
